import { Directive ,HostListener,ElementRef,Renderer ,HostBinding} from '@angular/core';

@Directive({
  selector: '[appDirec01]'
})
export class Direc01Directive {

  // isPressed:boolean=false

  constructor(private el:ElementRef,private rednderer:Renderer) { }

  // @HostListener('click',['$event.target'])
  // onclick(p:HTMLElement){
  //     console.log('HTMLElement ',p,' is clicked')
  // }
  @HostBinding('class.pressed') isPressed: boolean;

  @HostListener('document:click',['$event'])
  onclick(event){
      // console.log(event.target)
      // console.log(this.el.nativeElement);
      // this.rednderer.setElementStyle(this.el.nativeElement,'background-color','red')
  }

  @HostListener('mousedown') hasPressed() {
      console.log('mousedown')
      this.isPressed = true;
  }
  @HostListener('mouseup') hasReleased() {
      this.isPressed = false;
  }

}
